<!DOCTYPE html>
<%@page pageEncoding="UTF-8"%>
<html>
<head>
<title>from</title>
<%@include file="/resource/component.jsp"%>
</head>
<body>
	<div class="formBody">
		<div class="toolbar">
			<a class="nui-button" iconCls="icon-save" plain="true" onclick="validateForm">保存</a>
			<a class="nui-button" iconCls="icon-back" plain="true">退回</a>
			<a class="nui-button" iconCls="icon-ok" plain="true">同意</a>
			<span class="separator"></span>
			<a class="nui-button" iconCls="icon-undo" plain="true">驳回</a>
			<a class="nui-button" iconCls="icon-ok" plain="true" onclick="submitForm">提交到下一步</a>
			<a class="nui-button" iconCls="icon-print" plain="true">打印</a>
			<span class="separator"></span>
			<a class="nui-button" iconCls="icon-reload" plain="true">刷新</a>
			<a class="nui-button" iconCls="icon-cancel" plain="true">关闭</a>
		</div><!-- toolBar -->

		<div class="form-title">Form1</div>
		<div class="form-cont">
	<form id="pageForm" method="post">
		<table class="form-table">
			<tr class="bor">
				<th>申请人姓名</th>
				<td>
					<input name="username" class="nui-textbox" required="true" />
				</td>
				<th>申请人年龄</th>
				<td>
					<input name="Age" class="nui-spinner" value="22" minValue="18" maxValue="100" />
				</td>
				<th>申请人民族</th>
				<td>
					<input name="username" class="nui-textbox" required="true" />
				</td>
			</tr>
			<tr class="bor">
				<th>推荐人姓名</th>
				<td>
					<input name="username" class="nui-textbox" required="true" />
				</td>
				<th>推荐人年龄</th>
				<td>
					<input name="Age" class="nui-spinner" value="22" minValue="18" maxValue="100" />
				</td>
				<th>推荐人民族</th>
				<td>
					<input name="username" class="nui-textbox" required="true" />
				</td>
			</tr>
			<tr class="bor">
				<th>审批人姓名</th>
				<td>
					<input name="username" class="nui-textbox" required="true" />
				</td>
				<th>审批人年龄</th>
				<td>
					<input name="Age" class="nui-spinner" value="22" minValue="18" maxValue="100" />
				</td>
				<th>审批人民族</th>
				<td>
					<input name="username" class="nui-textbox" required="true" />
				</td>
			</tr>
			<tr class="bor">
				<th>推荐人意见</th>
				<td colspan="5">
					<input name="remarks" class="nui-textarea" required="true" style="width:95%;" />
				</td>
			</tr>
			<tr class="bor">
				<th>审批人意见</th>
				<td colspan="5">
					<input name="remarks" class="nui-textarea" required="true" style="width:95%;" />
				</td>
			</tr>
		</table>
	</form>
	</div>
	</div>
</body>
</html>
<script type="text/javascript">
nui.parse();

// 页面加载完成后执行
$(function(){
});

// 获取表单数据
var getForm = function() {
    var form = new nui.Form("#pageForm");
    var data = form.getData(true, false);
    var s = nui.encode(data);
    //form.setIsValid(false);
}

// 设置表单数据
var setForm = function() {
    var obj = {
        String: "abc",
        Date: "2020-11-12",
        Boolean: 'Y',
        TreeSelect: "ajax",
        countrys: "cn",
        //countrys2: "de",
        countrys3: "usa"
    };
    var form = new nui.Form("#pageForm");
    form.setData(obj, false);
}

// 重置表单数据
var resetForm = function() {
    var form = new nui.Form("#pageForm");
    form.reset();
}

// 清空表单数据
var clearForm = function() {
    var form = new nui.Form("#pageForm");
    form.clear();
}

// 提交表单数据
var submitForm = function() {
    var form = new nui.Form("#pageForm");            
    var data = form.getData(); //获取表单多个控件的数据
    var json = nui.encode(data); //序列化成JSON
    $.ajax({
        url: "../data/FormService.aspx?method=SaveData",
        type: "post",
        data: { submitData: json },
        success: function (text) {
            alert("提交成功，返回结果:" + text);
        }
    });
}

// 加载表单数据
var loadForm = function() {
    var form = new nui.Form("#pageForm");            
    $.ajax({
        url: "../data/FormService.aspx?method=LoadData",
        type: "post",
        success: function (text) {
            var data = nui.decode(text);//反序列化成对象
            form.setData(data);//设置多个控件数据
        }
    });
}

// 表单数据校验
var validateForm = function() {
    var form = new nui.Form("#pageForm");
    form.validate();
    if (form.isValid() == false) return;
}
</script>